/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
    BlobInputList, Input, InputLine, LineColumn, Select, Text, TextArea,
} from "customize-easy-ui-component";
import {InspectRecordLayout, InternalItemProps, useItemInputControl,} from "../../common/base";
import {useMeasureInpFilter} from "../../common/hooks";

interface ItemConclusionProps  extends InternalItemProps{
    startd?: boolean;
}
const 说明栏选 = ['规格（mm）:管件：\n' +
    'Ф114*38*5*3Ф114*4Ф114*5Ф114*57*4Ф114*68*5*4\n' +
    '直管：Ф68*4Ф95*4Ф114*4'
];
export const itemA结论 = ['检验结论', '检验日期','检验日期1','结论备注', '记事' ];
const defaultValCb= (par: any)=>{
    const { 产品种,产类别 }=par||{};
    if(!产品种)   par.产品种='工厂化预制管段';
    if(!产类别)   par.产类别='压力管道管件';
    return  par;
}
const itemA结论m =[...itemA结论, '产品种','产类别' ];
//证书 下半张页面：
export const ConclusionPolyZ =
React.forwardRef((
    {children, show, alone = true, refWidth,label,startd=false,}: ItemConclusionProps, ref
) => {
    const [getInpFilter] = useMeasureInpFilter(null, itemA结论m,defaultValCb);
    const {inp, setInp} = useItemInputControl({ref});
    return (
        <InspectRecordLayout inp={inp} setInp={setInp} getInpFilter={getInpFilter} show={show}
                             alone={alone} label={label!}>
            <Text variant="h5">
                {label} (报告下结论)：
            </Text>
            <LineColumn>
                <InputLine label='产品品种:'>
                    <Input value={inp?.产品种 || ''}
                           onChange={e => setInp({...inp, 产品种: e.currentTarget.value || undefined})}/>
                </InputLine>
                <InputLine label='产品类别:'>
                    <Input value={inp?.产类别 || ''}
                           onChange={e => setInp({...inp, 产类别: e.currentTarget.value || undefined})}/>
                </InputLine>
            </LineColumn>
            <hr/>
            <InputLine label='检验结论'>
                <Select inputSize="md" css={{minWidth: '140px', fontSize: '1.3rem', padding: '0 1rem'}}
                        value={inp?.检验结论 || ''}
                        onChange={e => setInp({...inp, 检验结论: e.currentTarget.value || undefined})}
                >
                    <option></option>
                    <option>符合</option>
                    <option>不符合</option>
                </Select>
            </InputLine>
            <InputLine label='设置检验日期'>
                <Input value={inp?.检验日期 || ''} type='date'
                       onChange={e => setInp({...inp, 检验日期: e.currentTarget.value})}/>
            </InputLine>
            {startd &&
                <InputLine label='检验起始日期'>
                    <Input value={inp?.检验日期1 || ''} type='date'
                           onChange={e => setInp({...inp, 检验日期1: e.currentTarget.value})}/>
                </InputLine>
            }
            <hr/>
            记事（用于记录监检过程中实施现场检查和抽查实物的结果记录、质量保证体系发现的问题等）：
            <TextArea value={inp?.记事 || ''} rows={6}
                      onChange={e => setInp({...inp, 记事: e.currentTarget.value || undefined})}/>
            其他说明栏：（记述不符合的具体情况和情节以及制造单位处理情况等）
            <BlobInputList value={inp?.结论备注 || ''} rows={6} datalist={说明栏选}
                           onListChange={v => setInp({...inp, 结论备注: v || undefined})}/>
        </InspectRecordLayout>
    );
});
